<template>
  <BasicModal v-bind="$attrs" title="修改密码" @register="register" @ok="handleSuccess">
    <div class="pt-3px pr-3px">
      <BasicForm @register="registerForm" />
    </div>
  </BasicModal>
</template>
<script lang="ts" setup>
  import { updatePassword } from '@/api/page/user_audit';
  import { BasicForm, FormSchema, useForm } from '@/components/Form/index';
  import { BasicModal, useModalInner } from '@/components/Modal';
  import { useMessage } from '@/hooks/web/useMessage';
  import { useUserStore } from '@/store/modules/user';

  const schemas: FormSchema[] = [
    {
      field: 'password',
      component: 'InputPassword',
      label: '新密码',
      colProps: {
        span: 24,
      },
      required: true,
    },
  ];
  const userStore = useUserStore();
  const [registerForm, { resetFields, validate }] = useForm({
    labelWidth: 60,
    schemas,
    showActionButtonGroup: false,
    actionColOptions: {
      span: 24,
    },
  });

  const [register, { closeModal }] = useModalInner((data) => {
    resetFields();
  });
  const { createMessage } = useMessage();
  const handleSuccess = async () => {
    try {
      const values = await validate();

      updatePassword({ id: userStore.userInfo?.userId, ...values }).then((res) => {
        if (res.code === 1000) {
          createMessage.success('修改成功！');
        } else {
          createMessage.error('修改失败，请重试！');
        }
      });
      closeModal();
    } catch (error) {
      console.log('error', error);
      createMessage.error('请填写新密码');
    }
  };
</script>
